<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>let声明变量</title>
</head>
<body>
    <script>
        /**
         * let声明变量只在{}内有效
        */

        // {
        //     let num = 12;
        //     console.log(num);
        // }

        //  console.log(num);//报错 引用不到

        /**
         * let声明变量不会出现变量提升
        */

        //   console.log(a);
        //   let a=20;//直到这一行a才会被定义


        /**TDZ(暂时性死区) 代码块内let声明的变量在定义之前无法被访问*/

        // var num = 12;
        // if(1){
        //     console.log(num);
        //     let num;  //报错
        // }

        /** 暂时性死区的本质就是，只要一进入当前作用域，所要使用的变量就已经存在了，但是不可获取，
         *  只有等到声明变量的那一行代码出现，才可以获取和使用该变量*/

        //  var x =x;  
        //  let x =x;//会报错

        /** let不允许在相同作用域内，重复声明同一个变量*/

        // if(true){
        //     var a = 12;
        //     let a = 12; 报错
        // }

    //    function foo1(num){
    //        let num =12; //报错(函数的参数是特殊的函数内的局部变量)
    //    }

    //    function foo2(num){
    //        var num =25; //没事 只会把函数参数重新赋值
    //    }

    /**块级作用域：*/

    /**
     * ES6中子作用域可以访问父作用域(作用域链)
     * 兄弟块级作用域之间不能互相访问
     * 父级块作用域不能访问子级块作用域
    */
    // function foo(){
    //   {let age  =12;}  
    //     if(1){
    //         console.log(age);//兄弟作用域之间互相访问不到
    //     }
    // }

        // function foo(){
        //     let num =12;
        //     if(1){
        //         console.log(num);//子级块作用域可以访问到父级的块作用域
        //     }
        // }

        // function foo(){
        //     console.log(num);
        //     if(1){
        //        let  num =100;//父级块作用域访问不到子级的块作用域
        //     }
        // }

        /**块级作用域的出现使得不需要通过匿名函数自调用的方式来隔绝变量*/

        // (function(w){

        //     var name ="hello";
        //     function getName(){
        //         return name;
        //     }

        //     window.getName =getName;

        // })(window);

        // console.log(getName());

        // {
        //     let name;
        // }

        

   
    </script>
</body>
</html>